<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="${pageContext.request.contextPath }/js/kindeditor-4.1.10/themes/default/default.css" type="text/css" rel="stylesheet">
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/js/kindeditor-4.1.10/lang/zh_CN.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
<link id="easyuiTheme" rel="stylesheet" type="text/css"	href="${pageContext.request.contextPath }/js/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/js/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/default.css">
<script type="text/javascript" src="${pageContext.request.contextPath }/js/ajaxfileupload.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/easyui/jquery.easyui.min.js"></script>
<script	src="${pageContext.request.contextPath }/js/easyui/locale/easyui-lang-zh_CN.js"	type="text/javascript"></script>
<script src="${pageContext.request.contextPath }/js/outOfBounds.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath }/js/common.js" type="text/javascript"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/layer/layer.js"></script>
</head>

<body>
<table class="easyui-datagrid" id="youngList" title="员工列表" data-options="singleSelect:false,collapsible:true,pagination:true,url:'${pageContext.request.contextPath }/young/listcontent',method:'get',pageSize:30,toolbar:toolbar">
    <thead>
        <tr>
        	<th data-options="field:'ck',checkbox:true"></th>
        	<th data-options="field:'id',width:120,align:'center'">ID</th>
            <th data-options="field:'name',width:150,align:'center'">姓名</th>
            <th data-options="field:'position',width:100,align:'center'">职务</th>
            <th data-options="field:'type',width:80,align:'center',formatter:function(val,rec){
            	if(val == 1){
            		return '季度';
            	} if(val == '2') {
            		return '年度';
            	}
            	return '数据有误';
            }">类别</th>
            <th data-options="field:'liveImg',width:100,align:'center',formatter:function(val, rec){
            	
            	if(val == null) {
            		return ;
            	}
            	var result = '<img src=' + val + ' onclick=javascript:loadImg(this) width=50px height=50px/>';
            	 return result;
            }">生活照</th>
            <th data-options="field:'headerImg',width:100,align:'center',formatter:function(val, rec){
            	
            	if(val == null) {
            		return ;
            	}
            	var result = '<img src=' + val + ' onclick=javascript:loadImg(this) width=50px height=50px/>';
            	 return result;
            }">头像</th>
            <th data-options="field:'motto',width:300,align:'center'">青春宣言</th>
            <th data-options="field:'status',width:60,align:'center',formatter:HONGXIN.formatStatus">是否可用</th>
            <th data-options="field:'createDate',width:130,align:'center',formatter:HONGXIN.formatDateTime">创建日期</th>
            <th data-options="field:'updateDate',width:130,align:'center',formatter:HONGXIN.formatDateTime">更新日期</th>
        </tr>
    </thead>
</table>

</body>
<div id="youngEditWindow" class="easyui-window" title="编辑员工信息" data-options="modal:true,closed:true,iconCls:'icon-save',href:'${pageContext.request.contextPath }/young/young_edit'" style="width:1000px;height:500px;padding:10px;" />

<script>
    function getSelectionsIds(){
    	var youngList = $("#youngList");
    	var sels = youngList.datagrid("getSelections");
    	var ids = [];
    	for(var i in sels){
    		ids.push(sels[i].id);
    	}
    	ids = ids.join(",");
    	return ids;
    }
    
    var toolbar = [{
        text:'编辑',
        iconCls:'icon-edit',
        handler:function(){
        	var ids = getSelectionsIds();
        	if(ids.length == 0){
        		$.messager.alert('提示','必须选择要编辑的员工!');
        		return ;
        	}
        	if(ids.indexOf(',') > 0){
        		$.messager.alert('提示','只能选择一位员工!');
        		return ;
        	}
        	
        	
        	$("#youngEditWindow").window({
        		
        		onLoad :function(){
        			//回显基础数据
        			//获取选中行的数据
        			var data = $("#youngList").datagrid("getSelections")[0];
        			
        			$("#youngEditForm").form("load",data);
        			
        		}
        		
        	}).window("open");
        }
    },{
        text:'锁定',
        iconCls:'icon-no',
        handler:function(){
        	var ids = getSelectionsIds();
        	if(ids.length == 0){
        		$.messager.alert('提示','未选中员工数据!');
        		return ;
        	}
        	$.messager.confirm('确认','确定删除ID为 '+ids+' 的优秀员工吗？',function(r){
        	    if (r){
        	    	var params = {"ids":ids};
                	$.post("${pageContext.request.contextPath }/young/lock",params, function(data){
            			if(data.status == 200){
            				$.messager.alert('提示',data.data,undefined,function(){
            					$("#youngList").datagrid("reload");
            				});
            			}
            		});
        	    }
        	});
        }
    },{
        text:'解锁',
        iconCls:'icon-remove',
        handler:function(){
        	var ids = getSelectionsIds();
        	if(ids.length == 0){
        		$.messager.alert('提示','未选中员工!');
        		return ;
        	}
        	$.messager.confirm('确认','确定还原ID为 '+ids+' 的员工吗？',function(r){
        	    if (r){
        	    	var params = {"ids":ids};
                	$.post("${pageContext.request.contextPath }/young/unlock",params, function(data){
            			if(data.status == 200){
            				$.messager.alert('提示',data.data,undefined,function(){
            					$("#youngList").datagrid("reload");
            				});
            			}
            		});
        	    }
        	});
        }
    },{
        text:'删除',
        iconCls:'icon-cancel',
        handler:function(){
        	var ids = getSelectionsIds();
        	if(ids.length == 0){
        		$.messager.alert('提示','未选中员工!');
        		return ;
        	}
        	$.messager.confirm('确认','确定删除ID为 '+ids+' 的员工吗？',function(r){
        	    if (r){
        	    	var params = {"ids":ids};
                	$.post("${pageContext.request.contextPath }/young/delete",params, function(data){
            			if(data.status == 200){
            				$.messager.alert('提示',data.data,undefined,function(){
            					$("#youngList").datagrid("reload");
            				});
            			}
            		});
        	    }
        	});
        }
    }];
    
    function loadImg(index) {
    	console.info(index.src)
    	 layer.open({
    	        type: 1,
    	        title:'头像信息',
    	        area: ['600px', '360px'],
    	        shadeClose: true, //点击遮罩关闭
    	        content: '\<\img style="padding:20px;" src='+index.src+'>\<\/img>'
    	    });
    }
    
    
  	//提交表单
	function submitForm(){
		//有效性验证
		if(!$('#youngEditForm').form('validate')){
			$.messager.alert('提示','表单还未填写完成!');
			return ;
		}
		
		$.post("${pageContext.request.contextPath}/young/update",$("#youngEditForm").serialize(), function(data){
			if(data.status == 200){
				$.messager.alert('提示',data.data);
				$("#youngEditWindow").window('close');
				$("#youngList").datagrid("reload");
			}else{
				$.messager.alert('提示',data.data);
				$("#youngEditWindow").window('close');
				$("#youngList").datagrid("reload");
			}
		});
	}
	
	function clearForm(){
		$('#youngEditForm').form('reset');
	}
	
	function uploadHeaderImg(){
		if($('#headerImgFile').val() == ''){
			$.messager.alert('提示','您还没有选择要上传的文件！');
			return false;
		}
		beforeSend();
		uploadHeaderImgFile();
	}
	function uploadLiveImg(){
		if($('#liveImgFile').val() == ''){
			$.messager.alert('提示','您还没有选择要上传的文件！');
			return false;
		}
		beforeSend();
		uploadLiveImgFile();
	}
	
	function beforeSend() { 
		var h = document.body.clientHeight; 
		$("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:h}).appendTo("body"); 
		$("<div class=\"datagrid-mask-msg\"></div>").html("正在上传数据，请稍候。。。").appendTo("body").css({display:"block", 
		left:($(document.body).outerWidth(true) - 190) / 2, 
		top:(h - 45) / 2}); 

		}
	function uploadHeaderImgFile(){

            $.ajaxFileUpload({
                url:'file/uploadHeaderImgFile',//用于文件上传的服务器端请求地址
                secureuri:true,//是否启用安全提交，一般设置为false
                fileElementId:'headerImgFile',//文件上传控件的id
                dataType:'text',//服务器返回的数据类型
                //success: function (data,status){
                success: function (data,status){
   						
                	$('.datagrid-mask-msg').remove(); 
                	$('.datagrid-mask').remove();
					//手动截取字符串,转换为json对象
					var jsonstring = data.substring(data.indexOf('{'),data.lastIndexOf('}') + 1);
					var jsondata = jQuery.parseJSON(jsonstring);
					
					if(jsondata.error == '0'){
						$('#headerImg').val(jsondata.url);
						$.messager.alert('提示','图片上传成功!');
					}else{
						$.messager.alert('提示','图片上传失败!');
					}
					
                },
                error: function (data,status,e){
                    alert("服务中断或连接超时导致通信失败！");
                }
            }
            )
            return false;
        }
	function uploadLiveImgFile(){

            $.ajaxFileUpload({
                url:'file/uploadLiveImg',//用于文件上传的服务器端请求地址
                secureuri:true,//是否启用安全提交，一般设置为false
                fileElementId:'liveImgFile',//文件上传控件的id
                dataType:'text',//服务器返回的数据类型
                //success: function (data,status){
                success: function (data,status){
   						
                	$('.datagrid-mask-msg').remove(); 
                	$('.datagrid-mask').remove();
					//手动截取字符串,转换为json对象
					var jsonstring = data.substring(data.indexOf('{'),data.lastIndexOf('}') + 1);
					var jsondata = jQuery.parseJSON(jsonstring);
					
					if(jsondata.error == '0'){
						$('#liveImg').val(jsondata.url);
						$.messager.alert('提示','图片上传成功!');
					}else{
						$.messager.alert('提示','图片上传失败!');
					}
					
                },
                error: function (data,status,e){
                    alert("服务中断或连接超时导致通信失败！");
                }
            }
            )
            return false;
        }
</script>